<template>
  <drop-wrap :data="data" :index="index" :element="element">
    <div class="shuttle-warp">
      <shuttle-table :leftTableConfig="leftTableConfig" :rightTableConfig="rightTableConfig"></shuttle-table>
    </div>
  </drop-wrap>
</template>

<script>
  import shuttleTable from "./shuttle_table.vue"
  export default {
    inject: ["getStore"],
    data () {
      return {
        leftTableConfig: {
          thHead: [
            {
              name: "工程",
            },
            {
              name: "已分摊金额",
            },
            {
              name: "未分摊金额",
            }

          ],
          tbData: [
            {
              id: '1',
              name: '人防工程监理(1)',
              havemoney: 1,
              waitmoney: '200,000.00',
              // check: true
            },
            {
              id: '2',
              name: '人防工程监理(2)',
              havemoney: 2,
              waitmoney: '200,000.00',
            },
            {
              id: '3',
              name: '人防工程监理(3)',
              havemoney: 3,
              disabled: true,
              waitmoney: '200,000.00',
            },
            {
              id: '4',
              name: '人防工程监理(4)',
              havemoney: 4,
              waitmoney: '200,000.00',
            }
          ]
        },
        rightTableConfig: {
          thHead: [
            {
              name: "工程",
            },
            {
              name: "已分摊金额",
            },
            {
              name: "未分摊金额",
            }

          ],
          tbData: []
        },
      }
    },
    components: {
      shuttleTable
    },
    props: ["element", "data", "index"],
    computed: {
      store () {
        return this.getStore();
      },
    },
  };
</script>

<style lang="scss" scoped>
.el-table {
  border-bottom: none;
  font-size: 12px;
  th {
    border-bottom: 1px solid #efefef;
    padding: 8px 0;
    text-align: center;
  }
  .el-table__header {
    .has-gutter {
      .is-left {
        text-align: left !important;
      }

      .is-right {
        text-align: right !important;
      }

      .cell {
        font-family: "PingFang SC ", "PingFang SC";
        font-weight: 400;
        font-style: normal;
        font-size: 12px;
        color: #999999;
        line-height: 23px !important;
      }
    }
  }
}
.card-main {
  .pageComponent {
    margin-top: 10px;
  }
  .table-merge-bottom {
    font-size: 16px;
    height: 26px;
    line-height: 26px;
    padding-left: 80%;
    border: 1px solid #e6e6e6;
    border-top: none;
  }
}
.el-table th.el-table__cell {
  background-color: #f6f6f6;
}
</style>